$(function () {
	//1.计算里程碑各项宽度
	function view_flow2(){
		var $view_flow = $('.view-flow');
		var $chart = null;
		var chartwidth = chartlength = 0;
		var max_width = $view_flow.width();
		if ($view_flow.length > 0) {
			for (var i = 0; i < $view_flow.length; i++) {
				$chart = $view_flow.eq(i).find('.chart');
				chartlength = $chart.length - 2;

				chartwidth = (max_width - ($chart.first()[0].offsetWidth + $chart.last()[0].offsetWidth)*0.5)/chartlength;
				$chart.eq(1).css('margin-left',$chart.first()[0].offsetWidth/2);
				for(var j = 0;j<$chart.length;j++){
					if(j!=0&&j!=($chart.length - 1)){
						$chart.eq(j).css('width',chartwidth);
					}
				}
			}
		}
	}
	function view_flow1(){
		var $view_flow = $('.view-flow');
		var $chart = null,
			chart_width = 18;
		var chartWidth = firstChartWidth = chartLength = 0;
		var max_width = $view_flow.width();
		if($view_flow.length > 0){
			for (var i = 0; i < $view_flow.length; i++) {

				$chart = $view_flow.eq(i).find('.chart');
				chartLength = $chart.length;
				firstChartWidth = $chart.first()[0].offsetWidth;
				chartWidth = (max_width - firstChartWidth )/(chartLength - 1);
				$view_flow.css('padding-left',(21+firstChartWidth));
				
				for(var j = 0;j<chartLength;j++){
					$chart.eq(j).css('width',chartWidth);
				}
			}//end for first
		}// end for if
	}
	function view_flow(){
		//1.计算里程碑各项宽度
		var $view_flow = $('.view-flow');
		var $chart = null;
		if($view_flow.length > 0){
			for(var i = 0;i<$view_flow.length;i++){
				$chart = $view_flow.eq(i).find('.chart');
				$chart.css('width','calc(100%/'+$chart.length+')');	
			}
		}
	}



    //2.tab_wrapper 组件切换
	tab_nav();
	function tab_nav() {
		var $tab_nav = $('.tab-wrapper .tab-nav'),
			$tab_view = $('.tab-view');
		var indexid = null;
		$tab_nav.on('click', function () {
			indexid = $(this).index('.tab-wrapper .tab-nav');

			//1.1tab_nav 状态切换
			$tab_nav.removeClass('active');
			$(this).addClass('active');

			//1.2视图切换
			$tab_view.css('display', 'none');
			$tab_view.eq(indexid).css('display', 'block');
			if (indexid == 0) {
				//1.2.1 index等于1
				$('.article-center').css('display', 'block');
				return false;
			}
			$('.article-center').css('display', 'none');

			if(indexid == 1){
				view_flow();
			}
		});
	}

});